<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>新增借用单</title>
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css?20190817.1">
    <link rel="stylesheet" href="/lib/layui/layui/css/common.css">
    <script src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js"></script>
    <script type="text/javascript" src="../../js/jquery/jquery-1.9.1.js"></script>
    <script src="../../js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <script src="/js/jquery/jquery.cookie.js"></script>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .layui-card-header{
            border-bottom: 1px solid #eee;
        }
        .newTable{
            width: 80%;
            margin: 0 auto;
        }
        .layui-form .one{
            width: 100%;
            display: flex;
            flex-flow: row wrap;
            justify-content: space-around;
        }
        .layui-form-item{
            width: 48%;
        }
        .layui-inline{
            width: 40%;
            height: 38px;
        }
        .layui-form-label{
            width:64px;
        }
        .layui-input-block{
            margin-left: 94px;
        }
        select{
            width: 100%;
            height: 38px;
        }
        input::-webkit-input-placeholder {
            color: #aab2bd;
        }
        .buttonbottom{
            text-align: center;
        }
        .buttonbottom button{
            background-color: #009284;
            width: 90px;
            margin-top: 30px;
        }
        .layui-treeSelect .ztree li span.button.root_open:before, .layui-treeSelect .ztree li span.button.root_close:before{
            content: "\e623";
        }
        .layui-form-selectup dl {
            top: 42px;
            bottom: unset;
        }
        #borrowerUser{
            line-height: 38px;
        }

    </style>
</head>
<body>
<div class="mbox">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form" lay-filter="formTest" action=""style="width: 100%;
            margin: 0 auto;">
                <input type="text" name="equipId" style="display: none" id="layui-form">
                <div style="width: 100%;height:36px;line-height:36px;font-weight:bold;padding-left: 6px;background-color: #eeeeee">借用信息</div>
                <div class="one" style="padding-top: 20px;">
                    <div class="layui-form-item">
                        <label class="layui-form-label" style=""><span style="color: red;">*</span>借用部门</label>
                        <div class="layui-input-block" id="deptoper">
                            <select name="borrowerdeptName" style="" id="borrowerdeptName" lay-filter="borrowerdeptName" >
                                <option value="0"></option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>借用人</label>
                        <div class="layui-input-block">
                            <div class="layui-input" onclick="xuanren(1)" id="borrowerUser"></div>
                            <input type="text" disabled name="borrowerUser"  placeholder="请输入" autocomplete="off" class="layui-input" style="display: none;">
                        </div>
                    </div>
                </div>

                <div class="one">

                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>借用日期</label>
                        <div class="layui-input-block">
                            <input type="text" name="borrowTime" disabled id="borrowTime" lay-verify="required" autocomplete="off" class="layui-input"  placeholder="yyyy-MM-dd" >
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>预计归还日期</label>
                        <div class="layui-input-block">
                            <input type="text" name="expectReturnDate" id="expectReturnDate"  lay-verify="required" autocomplete="off" class="layui-input"  placeholder="yyyy-MM-dd" >
                        </div>
                    </div>
                </div>
                <div class="one">
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span style="color: red;">*</span>在预计归还时间
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="reminderTime" value="7" id="reminderTime" lay-verify="required"  placeholder="请输入" autocomplete="off" class="layui-input" style="display:inline;width:70px">
                            <span>天前提醒归还</span>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">备注</label>
                        <div class="layui-input-block">
                            <input type="text" name="memo"  id="memo"  placeholder="请输入" autocomplete="off" class="layui-input">
                        </div>
                    </div>


                </div>
                <div class="one">
                    <div class="layui-form-item">
                        <label class="layui-form-label" style=""><span style="color: red;">*</span>借出部门</label>
                        <div class="layui-input-block" id="deptop">
                            <select name="lendDeptId" style="" id="lendDeptId" lay-filter="" >
                                <option value="0"></option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item layui-form-text">
                        <label class="layui-form-label"><span style="color: red;">*</span>借出人</label>
                        <div class="layui-input-block" >
                            <input type="text" disabled name="borrowerOperationUser" id="borrowerOperationUser" placeholder="请输入" autocomplete="off" class="layui-input" value="">
                        </div>
                    </div>
                </div>
                <div id="eqba" style="width: 100%;height:36px;line-height:36px;font-weight:bold;padding-left: 6px;background-color: #eeeeee">设备信息</div>
                <table id="Settlement" lay-filter="SettlementFilter"></table>
                <div class="buttonbottom">
                    <button id="submit" class="layui-btn layui-btn-sm"lay-submit lay-filter="formDemo" style="display: none"></button>
                </div>
            </form>


        </div>
    </div>
</div>
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" type="button" lay-event="addd" style="width: 70px">选择设备</button>
        <button class="layui-btn layui-btn-sm" lay-event="pdel" style="width: 70px">删除</button>
    </div>
</script>
<script>
    var datas="",
        borrow="";
    var eqdata;
    var arr=[];
    var SettlementTable;
    function getQueryString(name){
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return  unescape(r[2]); return null;
    }
    var begin = getQueryString("begin");
    var lendId=getQueryString("lendId");
    var userId=$.cookie('userId');
    var userName=$.cookie('userName');
    $("#borrowerOperationUser").val(userName);
    var deptId=0;
    layui.use(['form', 'layedit','table', 'laydate','element','treeSelect'], function() {
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate
            , treeSelect = layui.treeSelect
            , table = layui.table;
        var $ = layui.jquery;
        if (begin == "add") {
            //填充借用部门下拉框
            //lr 改动。
            $.ajax({
                type: 'get',
                url: '/EquipBorrow/getorganization',
                dataType: 'json',
                success: function (data) {
                    var render = [];
                    var t = data.data;
                    render.push("<option class=''></option>");
                    for (var i = 0; i < t.length; i++) {
//                        var option = '<option class="" value="' + t[i].deptId + '">' + t[i].deptName + '</option>'
                        render.push("<option class='' value=\"" + t[i].deptId + "\">" + t[i].deptName + "</option>");
//                        $("#borrowerdeptName").append(option)
                    }
//                    console.log(render.join(''))
                    $("#borrowerdeptName").html(render.join(""));

                    form.render();
                }
            })
            $.ajax({
                type: 'get',
                url: '/EquipBorrow/Laboratory',
                dataType: 'json',
                success: function (data) {
                    var render = [];
                    var y = data.data;
                    render.push("<option class=''></option>");
                    for (var i = 0; i < y.length; i++) {
                        render.push("<option class='' value=\"" + y[i].deptId + "\">" + y[i].deptName + "</option>");
                    }
                    $("#lendDeptId").html(render.join(""));
                    $('#lendDeptId').find('option[value="' + y[0].deptId + '"]').prop('selected', 'ture');
                    layui.form.render();
                }
            })
            SettlementTable = table.render({
                elem: '#Settlement'
                , url: ''
                , data: []
                , toolbar: '#toolbar'
                , cols: [[ //标题栏
                     {type: 'checkbox',LAY_CHECKED:true }
                    // ,{type: 'numbers', title: '序号'}
                    , {field: 'equipNo', title: '固定资产编号'}
                    , {field: 'equipName', title: '设备名称'}
                    , {field: 'factoryNo', title: '出厂编号'}
                    , {field: 'equipStatuasId', title: '资产状态'}
                    , {field: 'modelNo', title: '型号'}
                    , {field: 'spec', title: '规格'}
                ]]
                ,done:function(res) {
                    if(res.data.length==0){
                        $('.layui-form-checkbox').removeClass('layui-form-checked')
                    }
                }
            });
             table.on('toolbar(SettlementFilter)', function (obj) {
                var events = obj.event;
                /*多选删除,增加，多选提交*/
                if (events == 'pdel') {//批量删除
                    var checkStatus = table.checkStatus('Settlement').data;
                    for (var i = 0; i < checkStatus.length; i++) {
                        deleteItem(checkStatus[i].equipId, arr);
                    }
                    if (checkStatus == undefined || checkStatus.length <= 0) {
                        layer.msg("请选中一条或者多条数据进行删除");
                    }
                    if (checkStatus != undefined && checkStatus.length > 0) {
                        SettlementTable.reload({
                            data: arr
                        })
                    }
                }
                else if (events == 'addd') {// 新增
                    var lendDeptId = $("#deptop").find("dl dd.layui-this").attr("lay-value");
                    var borrowerdeptId = $("#deptoper").find("dl dd.layui-this").attr("lay-value");
                    var userId = $("#borrowerUser").attr("data-id");
                    var borrowerUser = $("#borrowerUser").next().val();
                    if(lendDeptId==undefined){
                        layer.msg("请选择借出部门");
                        return false;
                    }
                    if(borrowerdeptId==undefined){
                        layer.msg("请选择借用部门");
                        return false;
                    }
                    if(lendDeptId==borrowerdeptId){
                        layer.msg("借用单只能用于跨部门借出");
                        return false;
                    }
                    var index = layer.open({
                        type: 2,
                        skin: 'layui-layer-rim', //加上边框
                        area: ['95%', '100%'], //宽高
                        title: '选择设备',
                        maxmin: true,
                        content: '/EquipBorrow/indexList?deptId='+lendDeptId,
                        btn: ["确认", "取消"],
                        btnAlign: 'c',
                        yes: function (index, layero) {
                            eqdata = $(layero).find("iframe")[0].contentWindow.getData();
                            if (eqdata.length == 0) {
                                layer.msg("请选择设备再进行添加！");
                                return false;
                            } else {
                                layer.close(index);
                                for (var i = 0; i < eqdata.length; i++) {
                                    arr.push(eqdata[i]);
                                }
                                // 数组对象去重
                                var result = [];
                                var obj = {};
                                for (var i = 0; i < arr.length; i++) {
                                    if (!obj[arr[i].equipId]) {
                                        result.push(arr[i]);
                                        obj[arr[i].equipId] = true;
                                    }
                                }
                                SettlementTable.reload({
                                    data: result
                                })
                            }
                        }
                    });
                }
                // 子调父关闭弹框方法
                function close() {
                    layer.closeAll();
                }
            });
        }
        if (begin == "edit") {
            $("#eqba").css("display", "none")
            $.ajax({
                type:"post",
                url:"/EquipBorrow/getlendByid",
                dataType:"json",
                data:{
                    lendId:lendId
                },
                success:function (res) {
                    var objdata = res.object;
                    objdata.expectReturnDate = format(objdata.expectReturnDate);
                    objdata.borrowTime = format(objdata.borrowTime);
                    form.val("formTest",objdata);
                    $.ajax({
                        type: 'get',
                        url: '/EquipBorrow/getorganization',
                        dataType: 'json',
                        success: function (data) {
                            var render = [];
                            var t = data.data;
                            render.push("<option class=''></option>");
                            for (var i = 0; i < t.length; i++) {
//                        var option = '<option class="" value="' + t[i].deptId + '">' + t[i].deptName + '</option>'
                                render.push("<option class='' value=\"" + t[i].deptId + "\">" + t[i].deptName + "</option>");
//                        $("#borrowerdeptName").append(option)
                            }
//                    console.log(render.join(''))
                            $("#borrowerdeptName").html(render.join(""));

                            form.render();
                        }
                    })
                    $.ajax({
                        type: 'get',
                        url: '/EquipBorrow/Laboratory',
                        dataType: 'json',
                        success: function (data) {
                            var render = [];
                            var y = data.data;
                            render.push("<option class=''></option>");
                            for (var i = 0; i < y.length; i++) {
                                render.push("<option class='' value=\"" + y[i].deptId + "\">" + y[i].deptName + "</option>");
                            }
                            $("#lendDeptId").html(render.join(""));
                            $('#lendDeptId').find('option[value="'+objdata.lendDeptId+'"]').prop('selected',true);
                            layui.form.render();
                        }
                    })
                    $("#lendDeptId").attr("disabled","disabled")
                    layui.form.render();
                    $("#borrowerUser").html(objdata.bowwerUserName);
                    $("#borrowerOperationUser").val(objdata.lendUserName)
                    $("#borrowerUser").attr("da-id",objdata.userId);


                }
            })
        }
        laydate.render({
            elem: '#borrowTime'
            , trigger: 'click'//呼出事件改成click
            , format: 'yyyy-MM-dd'
            , value: new Date()
        });
        laydate.render({
            elem: '#expectReturnDate'
            , trigger: 'click'//呼出事件改成click
            , format: 'yyyy-MM-dd'
        });
        form.on('select(borrowerdeptName)', function (data) {
            deptId = data.elem.value;
        });

    })
    function Xrborrow(bo) {
        $("#show").remove();
        $("#borrowerUser").html("<span id='show'>" + bo.userName + "</span>");
        $("#borrowerUser").next().val(bo.userId);
        $("#borrowerUser").next().attr("da-id",bo.userId);

    }
    function xuanren(me) {
        if (me == 1) {
            borrow = "borrow";
            if (deptId == 0) {
                layui.layer.msg("请选择借用部门")
                return false;
            }
        }
        $.popWindow("../common/lmisSelectUserExp?0");
    }
    //解决下拉框内有数据undefined问题
    function a(value) {
        if (value == undefined) {
            return ""
        }
        return value
    }
    function deleteItem(item, list) {
        // 先遍历list里面的每一个元素，对比item与每个元素的id是否相等，再利用splice的方法删除
        for (var key in list) {
            if (list[key].equipId === item) {
                list.splice(key, 1)
            }
        }
    };

    //父级页面调用子级页面
    function addData() {
        var ownerLog = {};
        ownerLog.borrowerDetpId = $("#deptoper").find("dl dd.layui-this").attr("lay-value");
        ownerLog.lendDeptId = $("#deptop").find("dl dd.layui-this").attr("lay-value");
        ownerLog.userId = $("#borrowerUser").attr("data-id");
        ownerLog.borrowerUser = $("#borrowerUser").next().val();
        ownerLog.borrowTime = $("#borrowTime").val();
        ownerLog.expectReturnDate = $("#expectReturnDate").val();
        ownerLog.memo = $("#memo").val();
        ownerLog.reminderTime = $("#reminderTime").val();
        ownerLog.borrowerOperationUser = userId;
        return ownerLog;
    }

    function addjData() {
        var jsondata = layui.table.cache["Settlement"];
        return jsondata;
    }
    //将毫秒数转为yyyy-MM-dd格式时间
    function format(t) {
        var str = "";
        var nnow = new Date(t);
        var year = nnow.getFullYear();
        var month = nnow.getMonth() + 1;
        var day = nnow.getDate();
        str = year + "-" + month + "-" + day;
        return str;
    }
</script>
</body>
</html>